// 引入公共样式文件
@import './common.scss';

//  ---分类页面样式设置---

// 分类框内容样式

main {
  .kind_select {
    position: relative;
    padding-bottom: vw(40);

    ul {
      display: flex;
      justify-content: space-between;
      li {
        a {
          display: flex;
          flex-direction: column;
          align-items: center;
        }
      }
      img {
        width: vw(149);
        height: vw(149);
      }
      span {
        margin-top: vw(10);
        font-size: vw(26);
      }
    }

    // 进度条样式
    .progress {
      position: absolute;
      bottom: 0;
      left: 50%;
      transform: translate(-50%);
      span {
        display: inline-block;
        width: vw(20);
        height: vw(20);
        border-radius: 50%;
        background-color: #ffc9a1;
        &:first-of-type {
          background-color: #ff9344;
        }
      }
    }
  }

  // 美食区域
  .food,
  .sport,
  .movie {
    // 标题
    .label {
      margin: vw(50) vw(0) vw(50);
      .left {
        display: flex;
        align-items: center;
        img {
          margin-right: vw(10);
          width: vw(54);
        }
        span {
          font-size: vw(30);
        }
      }
    }
    // 内容
    .content {
      margin: vw(10) vw(0) vw(52);
      display: flex;
      justify-content: space-between;
      img {
        width: vw(133);
        height: vw(133);
      }
    }
  }

  .movie:last-of-type {
    margin-bottom: vw(200);
  }
}

footer {
  ul {
    li {
      a {
        i.icon-fenlei {
          color: red;
        }
      }
    }
  }
}
